<template>
    <div>
        <Modal :title="modalTitle" v-model="modalShow" :width="modalWidth" :mask-closable="false" :closable="false">
            <div v-show="modalType === 'edit' || modalType === 'add'">
                <Form ref="formItem" :rules="ruleValidate" label-position="right" :model="formItem" :label-width="130">
                    <FormItem label="节点名称：" prop="node_title">
                        <Input type="text" v-model="formItem.node_title" placeholder="请输入节点名称"
                               clearable></Input>
                    </FormItem>
                    <FormItem label="节点依据：" prop="node_yi_ju">
                        <Input type="text" v-model="formItem.node_yi_ju" placeholder="请输入节点依据"
                               clearable></Input>
                    </FormItem>
                    <FormItem label="节点任务：" prop="node_yi_ju">
                        <Input type="text" v-model="formItem.node_ren_wu" placeholder="请输入节点任务"
                               clearable></Input>
                    </FormItem>
                    <FormItem label="节点风险：" prop="node_yi_ju">
                        <Input type="text" v-model="formItem.node_warning" placeholder="请输入节点风险"
                               clearable></Input>
                    </FormItem>
                    <FormItem label="节点流转：" prop="node_flow">
                        <Input type="text" v-model="formItem.node_flow" placeholder="请输入节点流转"
                               clearable></Input>
                    </FormItem>
                    <FormItem label="节点协同：" prop="node_xie_tong">
                        <Input type="text" v-model="formItem.node_xie_tong" placeholder="请输入节点协同" clearable></Input>
                    </FormItem>
                    <FormItem label="调整排序：" prop="sort">
                        <Input type="text" v-model="formItem.sort" placeholder="请输入调整排序" number clearable></Input>
                    </FormItem>
                </Form>
            </div>
            <div slot="footer">
                <template v-if="modalType === 'edit' || modalType === 'add'">
                    <Button type="text" @click="cancelOption">取消</Button>
                    <Button type="success" @click="saveOption" :loading="btnLoading">保存</Button>
                </template>
            </div>
        </Modal>
    </div>
</template>

<script>
import {
  insertSstGovFlow,
  updateSstGovFlow
} from '@/api/setting/flow-setting.js'
export default {
  name: 'optionModalSetting',
  props: {
    modalTitle: {
      type: String,
      default: () => {
        return ''
      }
    },
    modalType: {
      type: String,
      default: () => {
        return ''
      }
    },
    modalShow: {
      type: Boolean,
      default: () => {
        return false
      }
    },
    modalWidth: {
      type: Number,
      default: () => {
        return 800
      }
    },
    dataObj: {
      type: Object,
      default: () => {
        return {}
      }
    },
    baseInfoId: {
      type: String,
      default: () => {
        return ''
      }
    }
  },
  data () {
    const validateAge = (rule, value, callback) => {
      if (!value) {
        return callback(new Error('排序不能为空'))
      }
      // 模拟异步验证效果
      setTimeout(() => {
        if (!this.$common.xeUtils.isInteger(value)) {
          callback(new Error('输入类型为数字'))
        } else {
          callback()
        }
      }, 100)
    }
    return {
      ruleValidate: {
        node_title: [
          { required: true, message: '节点名称不能为空', trigger: 'blur' }
        ],
        sort: [
          { required: true, validator: validateAge, trigger: 'blur' }
        ]
      },
      btnLoading: false,
      formItem: {
        gov_base_id: '',
        sort: 1
      },
      categoryObj: {}
    }
  },
  methods: {
    cancelOption () {
      this.$emit('cancelOption')
    },
    saveOption () {
      let param = {}
      if (this.modalType === 'add') {
        param = this.formItem
        param.gov_base_id = this.baseInfoId
        this.$refs['formItem'].validate((valid) => {
          if (valid) {
            this.btnLoading = true
            insertSstGovFlow(param).then(ret => {
              let data = ret.data
              if (data.errcode === 0) {
                console.log('===', data)
                this.success()
                this.btnLoading = false
                this.$emit('saveOption')
              } else {
                this.error(data)
                this.btnLoading = false
              }
            })
          } else {
            this.$Message.error({
              content: '操作失败,请核对添加信息后重试'
            })
          }
        })
      } else if (this.modalType === 'edit') {
        param = this.formItem
        this.$refs['formItem'].validate((valid) => {
          if (valid) {
            this.btnLoading = true
            updateSstGovFlow(param).then(ret => {
              let data = ret.data
              if (data.errcode === 0) {
                console.log('===', data)
                this.success()
                this.btnLoading = false
                this.$emit('saveOption')
              } else {
                this.error(data)
                this.btnLoading = false
              }
            })
          } else {
            this.$Message.error({
              content: '操作失败,请核对添加信息后重试'
            })
          }
        })
      }
    },
    success (val) {
      val = this.$common.xeUtils.isEmpty(val) ? '操作成功' : val
      this.$Message.success(val)
    },
    error (data) {
      this.$Message.error({
        content: '操作失败,\n' + data.errmsg
      })
    }
  },
  mounted () {
  },
  watch: {
    dataObj (val) {
      this.formItem = val
    }
  },
  computed: {}
}
</script>

<style scoped>
</style>
